export default {
  name: "PaginationTable",
  props: {
    list: {
      type: Array,
      default: () => [] // prop:表头绑定的地段，label：表头名称，align：每列数据展示形式（left, center, right），width:列宽
    }, // 数据列表
    columns: {
      type: Array,
      default: () => [] // 需要展示的列 === prop：列数据对应的属性，label：列名，align：对齐方式，width：列宽
    },
    operates: {
      type: Object,
      default: () => {
        // width:按钮列宽，
        // fixed：是否固定（left,right）,
        // list 按钮集合 === 
          // label: 文本，
          // type: 'primary', // 类型（primary / success / warning / danger / info / text
          // show: true // 是否显示，
          // icon：按钮图标，
          // plain: true, // 是否朴素按钮，
          // disabled: false, // 是否禁用，
          // method：回调方法
      }
    },
    pagination: {
      type: Object,
      default: {} // 分页参数 === pageSize:每页展示的条数，pageIndex:当前页，pageArray: 每页展示条数的控制集合，默认 _page_array
    },
    getList: Function,
    options: {
      type: Object,
      default: {}
    } // table 表格的控制参数
  },
  components: {
    expandDom: {
      functional: true,
      props: {
        row: Object,
        render: Function,
        index: Number,
        column: {
          type: Object,
          default: null
        }
      },
      render: (h, ctx) => {
        const params = {
          row: ctx.props.row,
          index: ctx.props.index
        }
        if (ctx.props.column) params.column = ctx.props.column
        return ctx.props.render(h, params)
      }
    }
  },
  data() {
    return {
      multipleSelection: [], // 多行选中
    }
  },
  created() {
    // options 处理
    if (this.options.initTable !== false) {
      this.getList()
    }
    // === 表格参数默认值
    this.$parent.options = Object.assign({
      maxHeight: 500, // 表格 max-height
      initTable: false, // 是否一进来就加载表格数据
      stripe: false, // 是否为斑马纹 table
      loading: true, // 是否添加表格loading加载动画
      highlightCurrentRow: true, // 是否支持当前行高亮显示
      mutiSelect: false, // 是否支持列表项选中功能
      border: false
    }, this.options)
  },
  methods: {
    // 切换每页显示的数量
    handleSizeChange(size) {
      this.pagination.pageSize = size
      this.getList()
    },
    // 切换页码
    handleIndexChange(current) {
      this.pagination.pageNum = current
      this.getList()
    },
    // 多行选中
    handleSelectionChange(val) {
      this.multipleSelection = val
      this.$emit('handleSelectionChange', val)
    }
  }
}